<div id="navigation">
  <h1>目录</h1>
  <ul class="nav sidenav">
<!--
    {% for post in site.posts  %}
      {% capture this_year %}{{ post.date | date: "%Y" }}{% endcapture %}
      {% capture this_month %}{{ post.date | date: "%B" }}{% endcapture %}
      {% capture next_year %}{{ post.previous.date | date: "%Y" }}{% endcapture %}
      {% capture next_month %}{{ post.previous.date | date: "%B" }}{% endcapture %}

      {% if forloop.first %}
        <li><a href="#year_{{this_year}}">{{this_year}}</a>
          <ul class="nav">
            <li><a href="#month_{{this_year}}_{{this_month}}">{{this_month}}</a></li>
      {% endif %}

      {% if forloop.last %}
            </ul>
          </li>
      {% else %}
        {% if this_year != next_year %}
            </ul>
          </li>
          <li><a href="#year_{{next_year}}">{{next_year}}</a>
            <ul class="nav">
              <li><a href="#month_{{next_year}}_{{next_month}}">{{next_month}}</a></li>
        {% else %}    
          {% if this_month != next_month %}
              <li><a href="#month_{{next_year}}_{{next_month}}">{{next_month}}</a></li>
          {% endif %}
        {% endif %}
      {% endif %}
    {% endfor %}
-->
  </ul>
</div>

<script>
    /**
     * 添加文章页面 目录
     * 目前只添加了一级目录
     */
    $(function(){
        function GenerateContentList(){
            var article = $("article");
            var h1 = article.find("h1");
//            var h2 = article.find("h2");
            var hArr = new Array();
            $.each(h1, function () {
                hArr.push(this);
            });
//            $.each(h2, function () {
//                hArr.push(this);
//            });
            hArr.sort(function (a, b) {
                var i = $(a).attr("id");
                var j = $(b).attr("id");
                return i-j;
            });
            var navigation = $("#navigation").find("ul");
            $.each(hArr.reverse(), function () {
                navigation.prepend("<li><a href='#"+$(this).attr("id")+"'>"+$(this).text()+"</li></a>");
            });
        }
        GenerateContentList();
    })
</script>